#{extends '/temp/main.html'/}
*{#{set title:'所有任务'/}}*
<div class="page-group">
    <div class="page">
        <header class="bar bar-nav">
            <a href="javascript:history.go(-1);" class="icon icon-left pull-left back"></a>
            <!--<a href="login.html" class="button button-link toplogin pull-right"><span class="icon iconfont">&#xe618;</span></a>-->
            <h1 class="title">历史任务</h1>
        </header>

        <section class="helper_task content">
            <div class="topbar">
                <label><input id="ip_began_at" type="text" data-toggle='date' placeholder="开始日期" /></label>
                <label><input id="ip_end_at" type="text" data-toggle='date' placeholder="结束日期" /></label>
                <a href="#" class="button button-fill button-orange " onclick="searchTask()">查询</a>
            </div>

            <div id="ip_task_list" class="scroll_y list-block content infinite-scroll infinite-scroll-bottom"  style="margin-top: 2rem;" data-distance="50" >

            </div>

        </section>
    #{include '/temp/bottom.html'/}
    #{include '/temp/taskListTemp.html'/}

    </div>
</div>
<script>
    var page_num = 1;
    var isLoading = false;

    $(function () {
        $.init();
        loadTasks(0);

        $(document).on('infinite', '.infinite-scroll-bottom', function () {
            console.log(isLoading);
            if (!isLoading) {
                loadTasks(1);
                isLoading = true;
            }
        })
    });


    //按时间查询
    function searchTask() {
        var began_at = $('#ip_began_at').val();
        var end_at = $('#ip_end_at').val();

        page_num = 1 ;
        loadTasks(0 , began_at , end_at);
    }

    //加载任务列表 loadFirst == 0 ：第一次加载 ，loadFirst > 0 ：第二次及以上加载 ，
    function loadTasks(loadFirst , beganAt , endAt) {
        if(isLoading) return ; // 如果正在加载，则退出
        isLoading = true ;
        $.showPreloader();
        $.getJSON('/task/loadTasks', {pageNum: page_num , pageSize:15 , beganAt:beganAt,endAt:endAt}, function (data) {
            console.log(data);
            if (data.taskList.length == 0) $.detachInfiniteScroll($('.infinite-scroll'));
            else $.attachInfiniteScroll($('.infinite-scroll'));
            if (data.success) {
                page_num = parseInt(page_num)+ 1;
                // console.log('page_num:',page_num);
                var gettpl = document.getElementById('task_list_tpl').innerHTML;
                laytpl(gettpl).render(data, function (html) {
                    // console.log('data :',data);
                    // console.log('loadFirst :',loadFirst);
                    if (loadFirst == 0) {
                        document.getElementById('ip_task_list').innerHTML = html;
                        $("#ip_task_list").scrollTop(0);
                        loadFirst = 1 ;
                        // return false;
                    } else
                        $('#ip_task_list').append(html);
                    setTimeout(function () {
                        $.hidePreloader();
                    }, 300);
                    $.refreshScroller();
                });
            }

            isLoading = false;

        })

    }
</script>


